
// -----------index.html-----------

 
  header{
    padding-top: .5px;
    border-bottom: 1px solid #ccc;
    background-color: #fff;
    // background: #72b2ed;
    background: url(../images/backg.png) no-repeat;
    // background-position:center top;
    background-size: 100%;
    .head{
      width: 6.9rem;
      padding-top: .3rem;
      margin: 0 auto;
      display: flex;
      justify-content: space-between;
      align-items: center;
      img{
        width: .4rem;
      }
      .head_text{
        font-size: .32rem;
        
        color: #fff;
        font-weight: bold;
      }
    }
     .search{
    // 移动端的单位要用erm
      width: 6.9rem;
      background-color: #ffffff;
      margin: 0 auto;
      height: .75rem;
      border-radius: .5rem;
      display: flex;
      align-items: center;
      margin-top: .34rem;
      img{
        width: .4rem;
        margin-left: .24rem;
        margin-right: .2rem;
      }
      & >input{
        border: none;
        background-color: #ffffff;
      }
   }
   .btext1{
    font-size: .45rem;
    font-weight: bold;
    color: #fff;
    margin-left: .5rem;
    padding-top: .7rem;
   }
   .btext2{
    font-size: .28rem;
    color: #fff;
    margin-left: .5rem;
    padding-top: .1rem;
   }
   button{
    width: 1.66rem;
    height: .42rem;
    line-height: .42rem;
    background-color: #fff;
    color: #76b1eb;
    border-style: none;
    margin-left: .5rem;
    border-radius: .5rem;
    font-size: .24rem;
    text-align: center;
    margin-top: .3rem;
    margin-bottom: 1.08rem;
   }
  }
 .content{
  // background-color: turquoise;
  margin: 0 auto;
  border-top-right-radius: .5rem;
  border-top-left-radius: .5rem;
  background-color: #fff;
  margin-top: -.5rem;
  .menu{
    width: 6.9rem;
    display: flex;
    flex-wrap: wrap;
    margin: 0 auto;
    // background-color: #fff;
    .item{
      width: 25%;
      text-align: center;
      padding-top: .52rem;
      font-size: .23rem;
      img{
        width: 1.02rem;
        padding-bottom: .19rem;
      }
      .title{
        font-size: .22rem;
        color: #000000;
      }
    }
  }
  .banner{
    width: 6.9rem;
    margin: 0 auto;
    padding-top: .6rem;
  }
  .ticket_box{
    margin: 0 auto;
    margin-top: .5rem;
    width: 6.9rem;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    .ticket{
      width: 32%;
      height: 1.36rem;
      margin-bottom: .09rem;
      background: url(../images/ticket.png) no-repeat;
      background-size: 100%;
      background-position: top center;
      .text1{
        font-size: .55rem;
        color: #fff;
        margin-left: .4rem;
        margin-top: .15rem;
        span{
          font-size: .25rem;
          color: #fff;
        }
      }
      .text2{
        margin-left: .4rem;
        font-size: .24rem;
        color: #fff;
      }
      .text3{
        width: .25rem;
        height: 1rem;
        font-size: .22rem;
        color: #fff;
        margin-left: 1.9rem;
        margin-top: -1.1rem;
        line-height: .27rem;
      }
    }
  }
 }
  footer nav ul{
  display: flex;
  // 固定定位会脱离文档流
  position: fixed;
  bottom: 0;
  width: 100%;
  background-color: #fff;
  li{
    width: 25%;
    text-align: center;
    padding: .23rem 0 .09rem;
    a{
      color: #464646;
      img{
      width: .36rem;
    }
      p{
        font-size: .17rem;
        margin-top: .13rem;
      }
    }
    
  }
  } 

// -----------shopping.html-----------

.head {
  width: 6.9rem;
  padding-top: 0.3rem;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  img{
    width: .22rem;
  }
  .img1{
    width: .4rem;
  }
  .head_text{
    font-size: .32rem;
    
    color: #fff;
    font-weight: bold;
  }
  .search{
    // 移动端的单位要用erm
      width: 5.8rem;
      background-color: #ebebeb;
      margin: 0 auto;
      height: .75rem;
      border-radius: .5rem;
      display: flex;
      align-items: center;
      img{
        width: .4rem;
        margin-left: .24rem;
        margin-right: .2rem;
        
      }
      & >input{
        border: none;
        color: #c4c4c4;
        background-color: #ebebeb;
      }
   }
}

.classify{
  margin-top: .42rem;
  ul{
    
    width: 6.9rem;
    margin: 0 auto;
    li{
      width: 24%;
      display: inline-block;
      text-align: center;
      a{
        color: #000;
      }
      img{
        width: .25rem;
      }
    }
  }
}
.container{
  width: 6.9rem;
  margin: 0 auto;
  margin-top: .2rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
  .item{
    width: 3.3rem;
    height: 4.62rem;
    box-shadow: .1rem .2rem .1rem #f0f0f0;
    border-radius: .2rem;
    .text3{
      margin-top: .2rem;
      color: #000000;
      font-size: .23rem;
      margin-left: .15rem;
    }
    i{
      color: #c60000;
      margin-top: .19rem;
      font-size: .21rem;
      margin-left: .15rem;
      s{
        color: #999999;
        font-size: .17rem;
      }
    }
  }
}

// -----------order.html-----------
.order_title{
  font-size: .33rem;
  color: #000000;
}
.classify1{
  margin-top: .42rem;
  margin-bottom: .58rem;
  ul{
    
    width: 6.9rem;
    margin: 0 auto;
    li{
      width: 19%;
      display: inline-block;
      a{
        color: #000;
      }
      img{
        width: .25rem;
      }
      a:focus{
        color: #72b0ed;
      }
    }
    li:nth-child(4) a{
      color: #72b0ed;
    }
  }
}
.container{
  width: 100%;
  box-shadow: 0rem .1rem 0.1rem gray;
  .item_box{
  width: 6.9rem;
  height: 3.6rem;
  margin: auto;
  display: flex;
  flex-direction: column;
  margin-bottom: .25rem;
 
  // background-color: chartreuse;
  .box{
    display: flex;
    flex-direction: row;
    img{
      width: 1.6rem;
    }
    .box1{
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      margin-left: .28rem;
      width: 5rem;
       .item_info{
        display: flex;
        flex-direction: column;
        justify-content: space-evenly;
        .text1{
          font-size: .25rem;
          color: #333333;
        }
        .text2{
          font-size: .21rem;
          color: #999999;
        }
        .price{
          font-size: .23rem;
          color: #c60000;
        }
      }
      .item_status{
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        margin-left: 2.58rem;
        .status{
          font-size: .25rem;
          margin-top: .1rem;
          color: #72b0ed;
        }
        .num{
          font-size: .25rem;
          color: #333333;
        }
      }
    }

   
  }
  .count{
    margin-top: .38rem;
    font-size: .23rem;
    color: #666666;
    text-align: right;
    span{
      color: #bf0000;
    }
  }
  .butt{
    margin-top: .36rem;
    margin-bottom: .4rem;
    display: flex;
    flex-direction: row-reverse;
    button{
      display: block;
      width: 1.7rem;
      height: .65rem;
      border: .01rem solid #72b0ed;
      line-height: .6rem;
      text-align: center;
      color: #72b0ed;
   
    }
    button1{
      display: block;
      width: 1.7rem;
      height: .65rem;
      border: .01rem solid #c0c0c0;
      line-height: .65rem;
      text-align: center;
      color: #c0c0c0;
      margin-right: .3rem;
    }
   
  }
}
}

// -----------me.html-----------
.header{
  padding-top: .5px;
  border-bottom: 1px solid #ccc;
  background-color: #fff;
  // background: #72b2ed;
  background: url(../images/me_bac.png) no-repeat;
  // background-position:center top;
  background-size: 100%;
  .per_info{
    width: 6.9rem;
    margin: 0 auto;
    margin-top: .42rem;
    display: flex;
    flex-direction: row;
    align-items: center;
    margin-bottom: .44rem;
    img{
      width: 1.1rem;

    }
    .info{
      margin-left: .3rem;
      .name{
        font-size: .33rem;
        color: #fff;
      }
      .sign{
        font-size: .2rem;
        color: #fff;
      }
    }
  }
  .mycount{
    width: 6.9rem;
    margin: 0 auto;
    height: 2.45rem;
    background-color: #fff;
    border-radius: .2rem;
    display: flex;
    flex-direction: row;
    padding: .35rem 2rem .4rem .3rem;
    justify-content: space-between;
    box-shadow: 0rem .1rem .1rem #ebfbfb;
    .left{
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      .count{
        font-size: .28rem;
        color: #101010;
        padding-bottom: .5rem;
      }
      .money{
        font-size: .28rem;
        color: #101010;
        padding-bottom: .2rem;
      }
      .yue{
        font-size: .2rem;
        color: #8c8c8c;
      }
    }
    .right{
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      .num{
        font-size: .28rem;
        color: #101010;
        padding-bottom: .2rem;
      }
      .quan{
        font-size: .2rem;
        color: #8c8c8c;
      }
    }
  }
  .order{
    width: 6.9rem;
    margin: 0 auto;
    height: 2.16rem;
    background-color: #fff;
    border-radius: .2rem;
    display: flex;
    flex-direction: row;
    padding: .77rem .35rem .4rem .3rem;
    justify-content: space-between;
    box-shadow: 0rem .1rem .1rem #ebfbfb;
    margin-top: .2rem;
    .item{
      width: 19%;
      text-align: center;
      img{
        width: .5rem;
      }
      .itemname{
        font-size: .21rem;
        color: #333333;
        margin-top: .24rem;
        font-weight: bold;
      }
    }
  }
  .mebanner{
    width: 6.9rem;
    margin: auto;
    margin-top: .4rem;
  }
}
.tool{
  width: 6.9rem;
  margin: 0 auto;
  // height: 2.16rem;
  background-color: #fff;
  border-radius: .2rem;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  padding: .77rem .35rem .4rem .3rem;
  // justify-content: space-between;
  box-shadow: 0rem .1rem .1rem #ebfbfb;
  margin-top: .2rem;
  .ttitle{
    width: 6.9rem;
    padding-bottom: .46rem;
   
  }
  .titem{
    text-align: center;
    margin: 0 .35rem;
    margin-bottom: .5rem;
    img{
      width: .5rem;
    }
    .tname{
      font-size: .21rem;
      color: #333333;
      margin-top: .24rem;
      font-weight: bold;
    }
  }
}

// -----------detail.html-----------
.dbox{
  width: 6.9rem;
  height: 4.2rem;
  background-color: rgb(221, 221, 221);
  border-radius: .3rem;
  margin: auto;
  padding: .5rem .5rem .5rem .5rem;
  .title{
    font-size: .3rem;
    font-weight: bold;
    color: #222;
  }
  .sub_title{
    font-size: .22rem;
    color: #787878;
    margin-top: 0.15rem;
  }
  .text1{
    font-size: .22rem;
    color: #787878;
    margin-top: 0.15rem;
    span{
      font-size: .22rem;
    color: #222;
    }
  }
  .ppp{
    display: flex;
    width: 5.9rem;
    flex-direction: row;
    justify-content: space-between;
    margin-top: .35rem;
    
    button{
      border-style: none;
      background-color: rgb(239, 177, 133);
      width: 1.65rem;
      border-radius: .5rem;
      height: .65rem;
      color: #fff;
    }
  }
  
}

// -----------Confirm.html-----------
.confirm{


.receipt_info{
  width: 100%;
  background-color: #fff;
  height: 1.3rem;
  margin: auto;
  margin-top: .4rem;
  padding: 0rem 0rem 0.3rem 0.4rem;
  .name{
    font-size: .27rem;
    color: #000000;
    padding-top: .1rem;
  }
  .add{
    font-size: .21rem;
    color: #b6b6b6;
    padding-top: .1rem;
  }
  .phone{
    font-size: .21rem;
    color: #b6b6b6;
    padding-top: .1rem;
  }
}
.item_info{
  display: flex;
  flex-direction: row;
  padding: .4rem .4rem .4rem .3rem;
  background: #fff;
  margin-top: 0.2rem;
  .itemimg img{
    width: 1.6rem;
  }
  .item_text{
    margin-left: .3rem;
    .itname{
      font-size: .24rem;
      color: #333333;
    }
    .guige{
      font-size: .21rem;
      color: #999999;
      margin-top: .15rem;
    }
    .ipp{
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
      height: .27rem;
      margin-top: .15rem;
      width: 4.6rem;
      .iprice{
        font-size: .26rem;
        color: #c60000;
      }
      .name{
        font-size: .21rem;
        color: #333333;
      }
    }
  }
}
.fukuan{
  display: flex;
  flex-direction: column;
  padding: .4rem .4rem .4rem .3rem;
  background: #fff;
  margin-top: 0.2rem;
  .money1{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 6.5rem;
    .mont{
      font-size: .3rem;
      color: #333333;
    }
    .monc{
      font-size: .3rem;
      color: #ae0000;
    }
  }
  .money2{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 6.5rem;
    margin-top: .7rem;
    .mont{
      font-size: .27rem;
      color: #333333;
    }
    .monc{
      font-size: .27rem;
      color: #ae0000;
    }
  }
  .money3{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 6.5rem;
    margin-top: .4rem;
    .mont{
      font-size: .25rem;
      color: #333333;
    }
    .monc{
      font-size: .25rem;
      color: #ae0000;
    }
  }
  .money4{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 6.5rem;
    margin-top: .4rem;
    align-items: center;
    .mont{
      font-size: .25rem;
      color: #333333;
    }
    button{
      width: 2.41rem;
      height: .9rem;
      color: #fff;
      border-radius: .5rem;
      border-style: unset;
      background: linear-gradient(45deg, #72b0ed 0%, #72cced 100%);
    }
  }
}
}